<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>钱包盒子-预约房抵贷</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link rel="stylesheet" href="../Public/css/Home/mui.css" />
		<link rel="stylesheet" href="../Public/css/Home/public.css" />
		<link rel="stylesheet" href="../Public/css/Home/mui.picker.css" />
		<link rel="stylesheet" href="../Public/css/Home/mui.poppicker.css" />
		<link rel="stylesheet" href="../Public/css/Home/post-form.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">预约房抵贷</h1>
		</header>
		<div class="mui-content">
			<div class="apply-title">
				<div class="tit">填写你的房屋信息，开始预约</div>
				<p class="text">请输入借款金额(元) <i class="mui-icon mui-icon-arrowright"></i></p>
			</div>

			<ul class="input-group">
				<li class="input-row layout-center r-arrow">
					<label>所在地区</label>
					<div class="flex-item1">
						<span id="showCityPicker" class="select-btn">请选择地区</span>
					</div>
				</li>
				<li class="input-row layout-center">
					<label>小区名称</label>
					<div class="flex-item1">
						<input type="text" name="" value="" placeholder="请填写小区名称" />
					</div>
				</li>
				<li class="input-row textarea-box">
					<label>详细地址</label>
					<div class="textarea">
						<textarea name="" rows="1" cols="" placeholder="填写详细地址，精确至门牌号"></textarea>
					</div>
				</li>
				<li class="input-row layout-center">
					<label>借款金额</label>
					<div class="flex-item1">
						<input type="text" name="" value="" placeholder="请输入借款金额" />
					</div>
				</li>
				<li class="input-row layout-center">
					<label>房屋面积 <span class="unit">(平米)</span></label>
					<div class="flex-item1">
						<input type="text" name="" value="" placeholder="请填写房屋面积" />
					</div>
				</li>
			</ul>
			<div class="btn-box3">
				<button id="sendBtn" class="mui-btn mui-btn-block send-btn disabled" type="button">下一步</button>
				<div class="note3">房抵贷贷款用途可用于消费和经营。消费包括购买大额消费产品、出国留学、外出旅游、房屋装修、购买汽车等消费活动。经营包括购买企业设备、支付租金等所有与企业生产经营相关的用途。严禁用于股指、期货、理财和房地产市场等与国家法律法规或监管规范相违背的任何用途。</div>
			</div>
			<div class="online-box">
				<a class="online-service" href="javascript:void(0);"></a>
			</div>
		</div>

	</body>
	<script src="../Public/js/Home/jquery.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../Public/js/Home/mui.js" type="text/javascript" charset="utf-8"></script>
	<script src="../Public/js/Home/common.js" type="text/javascript" charset="utf-8"></script>
	<script src="../Public/js/Home/mui.picker.js"></script>
	<script src="../Public/js/Home/mui.poppicker.js"></script>
	<script src="../Public/js/Home/city.data-3.js" type="text/javascript" charset="utf-8"></script>
	<script>
		mui.init();

		
		
		//选择城市
		var _getParam = function(obj, param) {
			return obj[param] || '';
		};
		var cityPicker3 = new mui.PopPicker({
			layer: 3
		});
		cityPicker3.setData(cityData3);
		var showCityPickerButton = document.getElementById('showCityPicker');
		showCityPickerButton.addEventListener('tap', function(event) {
			cityPicker3.show(function(items) {
				showCityPickerButton.innerText = _getParam(items[0], 'text') + " " + _getParam(items[1], 'text') + " " + _getParam(items[2], 'text');
				//返回 false 可以阻止选择框的关闭
				//return false;
			});
		}, false);
		
		
	</script>

</html>